<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>定义选项对象</title>
</head>
<body>

<div id="app">
    {{message}}
    <button v-on:click="alert">点击</button>
</div>


<script src="../js/vue.js"></script>
<script>
    //去掉警告
    Vue.config.productionTip = false;

    //数据对象
    const dataObj = {
        message : 'Hello, Vue!'
    };

    //数据冻结
    //Object.freeze(dataObj);

    //创建一个Vue对象
    const app = new Vue({
        el : '#app',
        data : dataObj,

        //方法
        methods : {
            alert : function () {
                alert('点击');
            }
        },
        created : function () {
            console.log('初始化后：' + this.message);
        },
        updated : function () {
            console.log('修改后：' + this.message);
        }
    });











</script>
</body>
</html>
